
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>银行业务管理系统</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
</head>
<body>
    <div class="container-fluid h-100">
        <div class="row h-100">
            <!-- 侧边栏 -->
            <div class="col-md-2 bg-dark text-white h-100 sidebar">
                <div class="p-4 border-bottom">
                    <h1 class="text-xl font-bold">银行管理系统</h1>
                </div>
                <nav class="p-4">
                    <ul class="nav flex-column">
                        <li class="nav-item">
                            <a class="nav-link {{ 'active' if request.path == '/dashboard' }}" href="/dashboard">
                                <i class="fa fa-tachometer mr-2"></i>仪表盘
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {{ 'active' if request.path == '/customers' }}" href="/customers">
                                <i class="fa fa-users mr-2"></i>客户管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {{ 'active' if request.path == '/cards' }}" href="/cards">
                                <i class="fa fa-credit-card mr-2"></i>银行卡管理
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {{ 'active' if request.path == '/transactions' }}" href="/transactions">
                                <i class="fa fa-exchange mr-2"></i>交易管理
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>

            <!-- 主内容区 -->
            <div class="col-md-10 main-content">
                <header class="bg-white shadow-sm p-3">
                    <div class="d-flex justify-content-between align-items-center">
                        <h2 class="mb-0">{{ title }}</h2>
                        <div class="d-flex align-items-center">
                            <span class="mr-3" id="welcome-message">欢迎, 管理员</span>
                            <button id="logout-btn" class="btn btn-outline-danger">
                                <i class="fa fa-sign-out mr-2"></i>退出
                            </button>
                        </div>
                    </div>
                </header>

                <main class="p-4">
                    {% block content %}{% endblock %}
                </main>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.8/dist/chart.umd.min.js"></script>
    <script src="{{ url_for('static', filename='js/app.js') }}"></script>
    {% block scripts %}{% endblock %}
</body>
</html>